<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>

<body>
    <script>
        const person = {
            name: 'zhangsan',
            age: 21,
            lag: ['java', 'js', 'python']
        }

        console.log(Object.keys(person))
        console.log(Object.values(person))
        console.log(Object.entries(person))

        const keys = Object.keys(person)

        keys.forEach(it => console.log(it))

        console.log('=============================')
        const entries = Object.entries(person)
        console.log(typeof entries)
        // const resMap = new Map(entries)
        // resMap.forEach((k, v) => {
        //     console.log(k, v)
        // })

        const resMap1 = new Map()
        entries.forEach((k, v) => {
            resMap1.set(k, v)
        })
        console.log('resMap1', resMap1)

        //Object.assign()
        //source中同样的key会覆盖前值
        const target = {
            a: 1,
            b: 2
        }
        const source = {
            b: 3,
            c: 4
        }
        const source1 = {
            aa: 3,
            cc: 4
        }
        const res = Object.assign(target, source, source1)
        console.log(res)
        console.log(target)
        console.log(source)

        //Object.keys()
        const keys1 = Object.keys(target)
        console.log(keys1)

        //Object.values()
        const values = Object.values(target)
        console.log(values)
        console.log('=============================')

        //声明对象简写
        const age = 23333
        const name = 'zhangsan333'
        const person3 = {
            ageProp: age,
            nameProp: name
        }
        console.log('person3===' + person3.ageProp + person3.nameProp)
        const person4 = {
            age,
            name
        }
        console.log('person4===' + person4.age + person4.name)
        console.log('=============================')

        //对象的函数属性简写
        const person5 = {
            age: 23,
            name: 'zhangsan',
            say: function () {
                console.log('hello world' + this.age + this.name)
            },
            say1: (param) => {
                //箭头函数里this会失效
                // console.log('hello world1111' + this.age + this.name + param)

                //传入其他对象也会报错
                // console.log('hello world1111' + person3.age + person3.name + param)

                console.log('hello world1111' + person5.age + person5.name + param)

            },
            //不使用箭头函数则可以
            say2(param1) {
                console.log(`hello world ${param1}` + this.age + this.name + 'param1')
            }
        }
        person5.say()
        person5.say1('aaaa')
        person5.say2('bbbb')
        console.log('=============================')

        //对象拓展运算符
        //1深拷贝
        let data1 = {
            lag: 'js'
        }
        let data2 = {
            job: 'coder'
        }
        const data3 = { ...data1, ...data2 }
        console.log('data3==' + data3)

        //合并对象
        let t1 = {
            fruit: 'apple'
        }
        let t2 = {
            body: "foot"
        }
        let t3 = {
            fruit: 'banana',
            body: 'head'
        }
        console.log(t3)

        t3 = { ...t1, ...t2 }
        console.log(t3)


    </script>
</body>

</html>